﻿<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<link rel="stylesheet" type="text/css" media="screen" href="css/redmond/jquery-ui-1.10.3.custom.min.css" />	<!-- jqueryUI CSS -->
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />							<!-- jqGrid CSS -->
<link rel="stylesheet" type="text/css" media="screen" href="css/selfTemplate.css" />						<!-- 本專案自行定義 CSS -->

<script src="js/jquery-1.10.2.min.js"></script>		<!-- jQuery 核心 -->
<script src="js/grid.locale-tw.js" type="text/javascript"></script>											<!-- jqGrid 語系檔 -->
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>										<!-- jqGrid 核心 -->
<script src="js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>							<!-- jqueryUI 核心 -->
<script src="js/jquery.cookie.js"></script>																	<!-- 操作cookie用 -->
<script src="js/widgets.js" type="text/javascript"></script>							<!-- jqueryUI 核心 -->

<title>維護Squad所包含的主機</title>

<script type="text/javascript">

function selectEnv() {
	
	$("input[type='checkbox']:first").prop("checked",false);	//把全選的勾去掉
	
	$("#dOpt").remove();	//移去 --請選擇--
	
	$("#gd").jqGrid('setGridParam',{
		url:"QuerySquadINenv",
		datatype: "json",
		postData: {
			bssId:"fOrder",
			subsysId:"fOrder",
			envId: function() { return $("#envSel option:selected").val(); },
		}
	}).trigger('reloadGrid');
	
	/* $("#gd").off('click',".jqgrow td input[type='checkbox']");
	$("#gd").on('click',".jqgrow td input[type='checkbox']", function () {
	}); */
	
	  
  	$("#gd").on('click',".jqgrow td input[type='checkbox']", function () {
  		var id = $(this).parent().next().html();
  		$('#gd').jqGrid('setSelection',id); 
  		
  		if ( $(this).is(":checked") ) {
  			$("#edit_gd").removeClass("ui-state-disabled");
  		} else {
  			$("#edit_gd").addClass("ui-state-disabled");
  		}
  	});
}

$(document).ready(function() {
	
	init("mappingEnvSquad.html");
	
	$.ajax({type:"post",url:"QueryEnv",dataType:"json",async:false,
		data:{subsysId:"fOrder",fc:"mappingSquadHost"},
		success : function(reses) {
			$("#envSel option").remove();
			$.each(reses,function(i,res) {
				var tmp = "<option value='"+res.id+"'>"+res.name+"("+res.id+")</option>";
				$("#envSel").append(tmp);
			});
		},error : function(xhr, ajaxOptions, thrownError) { errorAjx(xhr); }
	});
	
	
	
	$("#gd").jqGrid({
		url:"QuerySquadINenv",
		datatype: "json",
		postData: { bssId:"fOrder",subsysId:"fOrder", envId: function() { return $("#envSel option:selected").val(); },},
		colNames:["","資源群組ID","部署路徑","管理站台","PORT","帳號","密碼","s密碼"],
	   	//colNames:["<input type='checkbox' onclick='checkBox(event)' />","資源群組ID","部署路徑","管理站台","PORT","帳號","密碼","s密碼"],
	   	colModel:[
			{	/*	CheckBox for 勾選	*/
					name:'my_checkbox',
					width:75,
					align:'center',
					edittype:"checkbox",
					formatter: "checkbox",
					sortable: false,
					formatoptions: {disabled:false}
			},{	/*	資源群組ID	*/
	   			name:"squadId",
	   			index:"squadId",
	   			editable:false,
	   			editrules:{
	   				required:true
	   			}
	   		},{	/*	部署路徑	*/
	   			name:"squadPath",
	   			index:"squadPath",
	   			editable:false
	   		},{	/*	管理站台	*/
	   			name:"cip",
	   			index:"cip",
	   			editable:true
	   		},{	/*	PORT	*/
	   			name:"cport",
	   			index:"cport",
	   			editable:true
	   		},{	/*	帳號	*/
	   			name:"cid",
	   			index:"cid",
	   			editable:true
	   		},{
	   			name:"cpwd", 
	   			editable:true,
	   			hidden: true, hidedlg: true, editrules: { edithidden: true },
	   			edittype:"password"
	   		},{
	   			name:"aaa", 
	   			editable:false,
	   			hidden: true, hidedlg: true, editrules: { edithidden: true },
	   		}
	   	],
	   	rowNum: 6,
	   	pager: "#pager",
	   	forceFit: true,
		rownumbers: true,
	   	viewrecords: true,
	   	caption: "環境與ServerGroup對應",
	   	onSelectRow: function(id){ 
	   		$("#edit_gd").removeClass("ui-state-disabled");
	    },
	   	loadComplete: function() {
	   		$("#edit_gd").addClass("ui-state-disabled");
	   		var grid = $("#gd");
	   		var cm = grid.jqGrid('getRowData');
	        for (i=0; i<cm.length; i++) {
	        	if( cm[i].aaa != "" ) {
	        		$("table#gd tr#"+cm[i].aaa+" td input[type='checkbox']").prop("checked",true);
	        	}
	        }
	    	$("#gd").on('click',".jqgrow td input[type='checkbox']", function () {
	    		var id = $(this).parent().next().html();
	    		var isChecked = $(this).is(":checked");
	    		
	    		$('#gd').jqGrid('setSelection',id);
	    		var oper="del";
	      		if ( isChecked ) {
	      			$("#edit_gd").removeClass("ui-state-disabled");
	      			oper="add";
	      		} else {
	      			$("#edit_gd").addClass("ui-state-disabled");
	      			oper="del";
	      		}
	      		
	      		var cid = $(this).parent().next().next().next().next().next().html();
	    		var cip = $(this).parent().next().next().next().html();
	    		var cport = $(this).parent().next().next().next().next().html();
	    		var cpwd = $(this).parent().next().next().next().next().next().next().html();
	    		
	    		$.ajax({type:"post",url:"MES",dataType:"text",async:false,
	      			data:{oper:oper,cid:cid,cip:cip,cport:cport,cpwd:cpwd,subsysId:"fOrder",envId:$("#envSel option:selected").val(),empId:$.cookie("empId"),id:id },
	      			success : function(reses) {
	      			},error : function(xhr, ajaxOptions, thrownError) { errorAjx(xhr); }
	      		});
	    	});
	   	}
	}).jqGrid("navGrid","#pager",{add:false,edit:true,del:false,search:false,refresh:false},
		{	
			/* Edit */
			url: "MES",
			mtype: "POST",
			editData:{ 
				subsysId:"fOrder",
				envId: function() { return $("#envSel option:selected").val(); },
				empId:$.cookie("empId")
			}		
	});
	
}).tooltip();
</script>

</head>
<body>
	<div id="header"></div>
	<p>
	<img src="pic/mpEnvSquad.png" >
	<p>
	
<table>
	<thead class="tableFirst">
		<tr>
			<th class="right"><label for="env">環境：</label></th>
			<td>
				<select id="envSel" onchange="selectEnv()" ><option id="dOpt">--請選擇--</option></select>
			</td>
		</tr>
	</thead>
</table>

<p><p>
<table id="gd"></table>
<div id="pager"></div>
</body>
</html>